<template>
	<view class="">
		<view class="item">
			<view class="black_bar"></view>
			<view class="item_top">
				<view class="item_title">行车日志</view>
			</view>
			<view class="item_cont">
				<view class="cont_li">
					<view class="cont_li_label">日志单号</view>
					<view class="cont_li_value">{{infoData.notransId}}</view>
				</view>
				<view class="cont_li">
					<view class="cont_li_label">开始日期</view>
					<view class="cont_li_value">{{infoData.moveStartTime}}</view>
				</view>
				<view class="cont_li">
					<view class="cont_li_label">预计结束日期</view>
					<view class="cont_li_value">{{infoData.moveEndTime}}</view>
				</view>
				<view class="cont_li">
					<view class="cont_li_label">线路起点</view>
					<view class="cont_li_value">{{infoData.startPosAddr}}</view>
				</view>
				<view class="cont_li">
					<view class="cont_li_label">线路终点</view>
					<view class="cont_li_value">{{infoData.endPosAddr}}</view>
				</view>
				<view class="cont_li">
					<view class="cont_li_label">车牌号码</view>
					<view class="cont_li_value">{{infoData.vehCode}}</view>
				</view>
				<view class="cont_li">
					<view class="cont_li_label">车牌颜色</view>
					<view class="cont_li_value">{{infoData.vehColor}}</view>
				</view>
				<view class="cont_li">
					<view class="cont_li_label">挂车车牌号码</view>
					<view class="cont_li_value">{{infoData.trailerNo}}</view>
				</view>
				<view class="cont_li">
					<view class="cont_li_label">活动事由</view>
					<view class="cont_li_value">{{infoData.type}}</view>
				</view>
				<view class="cont_li">
					<view class="cont_li_label">具体事宜</view>
					<view class="cont_li_value">{{infoData.note}}</view>
				</view>
				<view class="cont_li">
					<view class="cont_li_label">填报日期</view>
					<view class="cont_li_value">{{infoData.createTime}}</view>
				</view>

			</view>
		</view>
	</view>
</template>

<script>
	import {
		getBillInfo,
		getFirBillInfo
	} from '@/common/api/monitor.js'
	export default {
		data() {
			return {
				infoData: {},
				queryData: null,
				isString: "",
				gInfo: []
			};
		},
		mounted() {
			this.infoData = this.$store.state.roadCheckInfo.outTrafficVO
			// 	for (let key in this.infoData) {
			// 		if (this.infoData[key] === "") {
			// 			this.infoData[key] = "无"
			// 		}
			// 		if (this.infoData.endDetailAddress && this.infoData.endDetailAddress.length == 0) {
			// 			this.infoData.endDetailAddress = '空'
			// 		}
			// 	}
			// 	this.infoData.tankVolume = Number(this.infoData.tankVolume).toFixed(1)


			// if (this.$store.state.roadCheckInfo.rwOutTrafficVO.vehCode.slice(0, 1) !== '鄂') {
			// 	this.isString = 'other'
				// this.gInfo = this.infoData.goodsInfo.split(',')
			}
		},
		// onLoad(option) { //option为object类型，会序列化上个页面传递的参数
		// 	console.log('传递的参数', option);
		// 	this.queryData = option
		// },
		methods: {},
	}
</script>

<style lang="scss">
	.item_top {
		width: calc(100% - 32rpx);
		height: 108rpx;
		display: flex;
		align-items: center;
		padding: 0 16rpx;

		.item_title {
			width: 100%;
			height: 100rpx;
			line-height: 100rpx;
			padding-left: 40rpx;
			position: relative;
			font-size: 30rpx;
			color: #1590EF;
			border-bottom: 1rpx solid #DDDDDD;
		}

		.item_title::before {
			position: absolute;
			content: '';
			top: 34rpx;
			left: 20rpx;
			width: 4rpx;
			height: 32rpx;
			background: #1590EF;
			border-radius: 10rpx;
		}
	}

	.item_cont {
		width: calc(100% - 40rpx);
		display: flex;
		flex-wrap: wrap;
		padding: 16rpx 20rpx;
		color: #666666;
		font-size: 28rpx;
		background: #fff;

		.cont_li {
			width: 100%;
			padding: 20rpx 0;
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;

			.cont_li_label {
				width: 256rpx;
			}

			.cont_li_value {
				flex: 1;
			}
		}
	}

	.black_bar {
		width: 100%;
		height: 20rpx;
		background: #F5F5F5;
	}
</style>